<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>销售退换货</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" href="../../css/jqweui/lib/weui.min.css">
    <link rel="stylesheet" href="../../css/jqweui/css/jquery-weui.css">
    <link rel="stylesheet" href="../../css/jqweui/css/jqweui_extend.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_539359_q9xrtmlc8gp.css">
    <script src="../../script/plugins/jquery.min.js"></script>
    <script type="text/javascript" src="../../script/plugins/in/in-min.js"></script>
    <script type="text/javascript" src="../../css/jqweui/js/in-config.js"></script>
    <script src="../../css/jqweui/js/jquery-weui.js"></script>
    <script src="../../css/jqweui/js/util.js"></script>
    <style>
        .weui-cell_swiped .btn{border-radius:0;color:#fff!important;line-height:78px;}
    </style>
</head>
<body class="wrap">
<section class="mc-view-box">
    <div class="mc-header-box">
        <div class="mc-header bg-black">
            <a href="javascript:;" onclick="utils.back();" class="head-icon">
                <i class="iconfont icon-arrow-left"></i>
            </a>
            <div class="main-box head-title text-left">
                退换货
            </div>
            <a href="javascript:;" class="head-icon">
            </a>
        </div>
    </div>
    <div class="mc-scrollview">
        <div class="weui-search-bar" id="searchBar">
            <form class="weui-search-bar__form">
                <div class="weui-search-bar__box">
                    <i class="weui-icon-search"></i>
                    <input type="search" class="weui-search-bar__input" id="searchInput" placeholder="按客户姓名或手机号码进行订单检索" required="">
                    <a href="javascript:" class="weui-icon-clear" id="searchClear"></a>
                </div>
                <label class="weui-search-bar__label" id="searchText">
                    <i class="weui-icon-search"></i>
                    <span>按客户姓名或手机号码进行订单检索</span>
                </label>
            </form>
            <a href="javascript:" class="weui-search-bar__cancel-btn" id="searchCancel">取消</a>
        </div>
        <div class="mc-order-item bg-white">
            <div class="weui-flex top-bar">
                <div class="weui-flex__item order-date">SN:20180701002345678</div>
                <div class="weui-flex__item text-right order-price text-color-6">￥2,200.00</div>
            </div>
            <div class="mc-flex-box" style="justify-content:space-between;">
                <div class="order-info">
                    <div class="mc-flex-box">
                        <div class="tit">客户名称：</div>
                        <div class="name"> 山西嘎嘎嘎家电子商务有限公司</div>
                    </div>
                    <div class="mc-flex-box">
                        <div class="tit">商品数量：</div>
                        <div class="name"> 8</div>
                    </div>
                </div>
                <div class="order-status">
                    <span class="status-bar bg-danger"></span>
                    <span class="status-bar bg-primary"></span>
                </div>
            </div>
            <div class="weui-flex pay-status">
                <div class="weui-flex__item">
                    <span class="icon-btn bg-primary">回</span>
                    <span class="money">0.00</span>
                </div>
                <div class="weui-flex__item">
                    <span class="icon-btn bg-warning">欠</span>
                    <span class="money">2,200.00</span>
                </div>
                <div class="weui-flex__item">
                    <span class="icon-btn bg-success">货</span>
                    <span class="money">提完</span>
                </div>
            </div>
        </div>
        <div class="m-d">
            <a href="javascript:;" class="btn btn-danger btn-block">全部退货</a>
        </div>
        <div class="mc-split-line bg-gray"></div>
        <div class="mc-goods-group bg-white">
            <div class="mc-index-title">
                商品详情
                <small class="pull-right" style="color:#989898;">左滑操作</small>
            </div>
            <div class="weui-panel weui-panel_access">
                <div class="weui-panel__bd">
                    <div class="weui-cell weui-cell_swiped">
                        <div class="weui-cell__bd" style="transform: translateX(-136px)">
                            <div class="weui-media-box weui-media-box_appmsg">
                                <div class="weui-media-box__hd">
                                    <img class="weui-media-box__thumb" src="../../image/01.jpg">
                                </div>
                                <div class="weui-media-box__bd">
                                    <h4 class="weui-media-box__title">春秋款薄被这里是商品名称</h4>
                                    <p class="weui-media-box__desc">规格：蓝色，1800*2000mm</p>
                                </div>
                                <div class="weui-media-box__ft text-right" style="padding-left:15px;font-size:14px;">
                                    ￥120.99<br>
                                    *15
                                </div>
                            </div>
                        </div>
                        <div class="weui-cell__ft">
                            <a class="btn btn-danger" href="javascript:">退货</a>
                            <a class="btn btn-warning" href="javascript:">换货</a>
                        </div>
                    </div>
                    <div class="weui-cell weui-cell_swiped">
                        <div class="weui-cell__bd">
                            <div class="weui-media-box weui-media-box_appmsg">
                                <div class="weui-media-box__hd">
                                    <img class="weui-media-box__thumb" src="../../image/01.jpg">
                                </div>
                                <div class="weui-media-box__bd">
                                    <h4 class="weui-media-box__title">春秋款薄被这里是商品名称</h4>
                                    <p class="weui-media-box__desc">规格：蓝色，1800*2000mm</p>
                                </div>
                                <div class="weui-media-box__ft text-right" style="padding-left:15px;font-size:14px;">
                                    ￥120.99<br>
                                    *15
                                </div>
                            </div>
                        </div>
                        <div class="weui-cell__ft">
                            <a class="btn btn-danger" href="javascript:">退货</a>
                            <a class="btn btn-warning" href="javascript:">换货</a>
                        </div>
                    </div>
                    <div class="weui-cell weui-cell_swiped">
                        <div class="weui-cell__bd">
                            <div class="weui-media-box weui-media-box_appmsg">
                                <div class="weui-media-box__hd">
                                    <img class="weui-media-box__thumb" src="../../image/01.jpg">
                                </div>
                                <div class="weui-media-box__bd">
                                    <h4 class="weui-media-box__title">春秋款薄被这里是商品名称</h4>
                                    <p class="weui-media-box__desc">规格：蓝色，1800*2000mm</p>
                                </div>
                                <div class="weui-media-box__ft text-right" style="padding-left:15px;font-size:14px;">
                                    ￥120.99<br>
                                    *15
                                </div>
                            </div>
                        </div>
                        <div class="weui-cell__ft">
                            <a class="btn btn-danger" href="javascript:">退货</a>
                            <a class="btn btn-warning" href="javascript:">换货</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<script>
    $('.weui-cell_swiped').swipeout();
</script>
</body>
</html>